<template>
    <div>
        <h1 style="width: 100%;font-size: 30px;">采购审批</h1>
        <el-table :data="tableData" border style=" width:100%">
            <el-table-column prop="proName" label="产品名称" width="150"/>
            <el-table-column prop="quantity" label="数量" width="100"/>
            <el-table-column prop="price" label="单价" width="100"/>
            <el-table-column prop="total" label="总金额" width="100"/>
            <!-- <el-table-column prop="supplier" label="供应商" width="150"/> -->
            <el-table-column prop="createTime" label="创建时间" width="200"/>
            <el-table-column prop="rensona" label="申请原因" />
            <el-table-column fixed="right" label="操作" width="200">
            <template #default="scope">
                <el-button type="danger" size="small" @click="shenpi(scope.row,'已拒绝')">
                    拒绝
                </el-button>
                <el-button type="success" size="small" @click="shenpi(scope.row,'已通过')">
                    通过
                </el-button>         
            </template>
            </el-table-column>
        </el-table>
    </div>
</template>

<script setup>
import { updatePurchase } from '@/api/puorder';
import { selectAllByReview } from '@/api/puorder';
import { ref,onMounted } from 'vue';
import { useUserStore } from '@/stores/user';
import router from '@/router';
const userstore=useUserStore()
const user=userstore.user
let form=ref()
const shenpi=(async(value,status)=>{
    form.value=value
    form.value.review=status
    if("已拒绝"==status){
        ElMessageBox.prompt(
            '请输入拒绝原因：',
            '确定',
            {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                inputPlaceholder: '请输入拒绝原因',
                inputErrorMessage: '输入内容不能为空',
                inputValidator: (value) => {
                    return !!value.trim();
                }
            }
        )
        .then(async ({ value }) => {
            form.value.rensonb = value;            
            await updatePurchase(form.value);
            ElMessage({
                type: 'success',
                message: '已拒绝该方案',
            });
            setTimeout(router.go(0),500)
        })
        .catch((action) => {
            if (action === 'cancel') {
                ElMessage({
                    type: 'info',
                    message: '取消成功',
                });
            } else if (action === 'close') {
                ElMessage({
                    type: 'info',
                    message: '已关闭对话框',
                });
            }
        });
    }else{
        await updatePurchase(form.value)
        ElMessage({
            type: 'success',
            message: '已通过该方案',
        });
        setTimeout(router.go(0),500)
    }
})
const tableData=ref(null)
const select=(async()=>{
    let response={}
    response=await selectAllByReview();
    tableData.value= response.data.data
})
onMounted(()=>{
    select()
})
</script>

<style scoped>
.demo-tabs > .el-tabs__content {
  padding: 32px;
  color: #6b778c;
  font-size: 32px;
  font-weight: 600;
}
.demo-tabs .custom-tabs-label .el-icon {
  vertical-align: middle;
}
.demo-tabs .custom-tabs-label span {
  vertical-align: middle;
  margin-left: 4px;
}
</style>